Version: older

v3.7.4 to v3.8.0

AUTOMATIC MIGRATION

Use the BIAToolKit to migrate the project
Manage the conflict (2 solutions)
1. In BIAToolKit click on "4 - merge Rejected" and search <<<<< in all files.
- Resolve the conflict manually.
1. Analyze the .rej file (search "diff a/" in VS code) that have been created in your project folder
- Apply manually the change.
Change source path and run the script V3.7.4_to_V3.8.0_Replacement.ps1
Apply other manual step (describe bellow) at the end if all is ok, you can remove the .rej files (during the process they can be useful to resolve build problem)

MANUAL STEPS

Warning : major change

The angular/flexLayout have be replace by PrimFlex (flexbox) and direct Css.
The automatic script do the replacement and manual step correct major issue.
But a risque exist that some functionality are not well treated.
For more info to correct :
- https://github.com/angular/flex-layout/wiki/
- https://primefaces.org/primeflex/

FRONT

If you don't use the Offline mode, disable the serviceWorker in the angular.json file : "serviceWorker": false
Replace haveAdvancedFilter by hasAdvancedFilter
Replace haveFilter by hasFilter
To display the badge on filter by column icon, when there is a filter
1. In every crud in bia-table-controller add [hasColumnFilter]="hasColumnFilter"
2. Additionally only for Crud in full-code in the index.component.ts :
  1. Add the variable
```
  hasColumnFilter = false; 
```
  1. In constructor add parameter
```
  private tableHelperService: TableHelperService,
```
  1. Resolve import.
  2. In function onLoadLazy add the code (adapt the variable planeTableComponent to the name of your table Calc, eventually delete one of the 2 tests if you have one only component = no switch from calc to non calc)
```
  this.hasColumnFilter= this.tableHelperService.hasFilter(this.biaTableComponent, true) || this.tableHelperService.hasFilter(this.planeTableComponent, true);
```
Adjust table-controller position:
1. in all CRUD index.component.scss Remove all
```
bia-table-controller {
    margin-left: -35px;
    margin-right: -35px;
}
```
=> it should stay only one in _bia-custom-theme.scss

In every CRUD index without advanced filter remove fxLayout in header = replace:

<div fxLayout fxLayout.xs="column" class="flex-wrap">
  <div class="flex-1" style="max-width:100%;">

<div>
  <div>

In every CRUD index with advanced filter remove fxLayout in header = replace:

<div fxLayout fxLayout.xs="column" fxLayoutWrap="wrap">
  <app-...-filter *ngIf="showAdvancedFilter"
    [fxFlexValue]="25"
    (filter)="onFilter($event)"
    (closeFilter)="onCloseFilter()"
    [advancedFilter]="crudConfiguration.fieldsConfig?.advancedFilter"
  ></app-...-filter>
  <div fxFlex="100">

<div class="flex flex-row flex-wrap bia-page-remove-margin">
  <app-...-filter *ngIf="showAdvancedFilter"
    (filter)="onFilter($event)"
    (closeFilter)="onCloseFilter()"
    [advancedFilter]="crudConfiguration.fieldsConfig?.advancedFilter"
  ></app-...-filter>
  <div class="flex-grow-1 bia-page-margin">

Adapt the AdvancedFilter flex :
1. replace in the html
```
<ng-template #template>
  <div [hidden]="hidden" class=" app-search-filter" fxFlex="{{ fxFlexValue }}">
```
  by
```
<ng-template #template>
  <div [hidden]="hidden" class="bia-advanced-filter flex-grow-1" style="min-width: 300px">
```
  Adapt eventually the min-width
2. in the css you can remove the class
- .app-filter-container
- .app-search-filter
- .pi pi-clear
- .header
- .header h1
1. in the .ts the variable fxFlexValue can be remove (and in CRUD index html where the component in call = action 6.)
Search fxLayoutGap in replace by a class equivalent ex: fxLayoutGap="32px" ... fxLayoutGap="24px" => class="gap-4" (1.5rem) fxLayoutGap="20px" ... fxLayoutGap="16px" => class="gap-3" (1rem) fxLayoutGap="15px" ... fxLayoutGap="8px" => class="gap-2" (0.5rem) fxLayoutGap="6px" ... fxLayoutGap="1px" => class="gap-1" (0.25rem) fxLayoutGap="0px" => class="gap-0" (0rem)

ref : https://primefaces.org/primeflex/gap and https://nekocalc.com/fr/px-a-rem-convertisseur

If you used badges with numbers inside, add this css class in _app-custom-theme.scss

.bia-badge-with-number > .p-badge {
  min-width: 1.5rem;
  height: 1.5rem;
}

and use it like this:

<i class="bia-badge-with-number" pBadge"></i>

In src\app\shared\bia-shared\features\view\views\view-list\view-list.component.html

Replace
```
item.label
```
By
```
item?.label
```
Replace
```
item.value
```
By
```
item?.value
```

Angular 14 migration:

In all module if there is in children list default path (path: '',) add (pathMatch: 'full',). Be careful this child should not have a children list.

        children: [    
          ...
          {
            path: '',
            pathMatch: 'full',
            redirectTo: 'edit'
          },

Angular 16 migration:

Replace all :

getPrimeNgTable().columns.map

getPrimeNgTable().columns?.map

If you have a custom header adjust the css .project-title if required (add min-height: 70px;)

  .project-title {
    display: flex;
    padding-left: 16px;
    font-family: 'oswald-regular';
    font-size: 19px;
    min-height: 70px;
  }

BUILD

DEPLOY

Create a new release from the BIA Begin Deploy Api - V3.* or apply these changes:

Begin Deploy - Web API : Remove the old task and create a new from this task, BIA Begin Deploy Api - V3.*
Begin Deploy - Service : Remove the old task and create a new from this task, BIA Begin Deploy Service - V3.*
End Deploy - Web API : Remove the old task and create a new from this task, BIA End Deploy Api - V3.*
End Deploy - Service : Remove the old task and create a new from this task, BIA End Deploy Service - V3.*
For the beginning and end tasks, respect the following order:
- Begin Deploy - Angular
- Begin Deploy - Web API
- Begin Deploy - Service
- ...
- End Deploy - Service
- End Deploy - Web API
- End Deploy - Angular
On Run agent Change the Pool Agent:
1. Use XXX_DEPLOY_INT for INT
2. Use XXX_DEPLOY_UAT for UAT
3. Use XXX_DEPLOY_PRD for PRD and PRA
Change all the group task version to use the task labeled : BIA ... V3.8.0 - *

AUTOMATIC MIGRATION​

MANUAL STEPS​

FRONT​

BUILD​

DEPLOY​

AUTOMATIC MIGRATION

MANUAL STEPS

FRONT

BUILD

DEPLOY